import React  from 'react'
import { useEffect } from 'react'
import { useState } from 'react'
/*
  useEffect:
    -useEffect也需要引入
    -Effect Hook 可以让你在函数组件中执行副作用操作
    -Effect: 可以告诉React组件需要在 挂载完成、更新完成、卸载完成执行某些操作
    -useEffect接受第一个参数是回调函数，当达到条件的时候，会触发当前的回调函数
    -useEffect接受第二个参数是一个数组
      -数组中传入state，则当前state发生改变的时候触发当前的effect中回调函数
      -如果传递一个空数组，则useEffect回调函数值有在初始化阶段才能执行
      -如果不传递第二个参数，则无论初始化还是更新的时候都会执行

    -useEffect的回调函数可以返回一个函数，当组件被卸载的时候，或者再次渲染的时候，会执行这个函数，用来做收尾工作

    -useEffect可以书写多个逻辑

*/
export default function App() {
  const [count, setSount] = useState(0)
  const [ishot, setIshot] = useState(true)

  useEffect(() => {
    console.log('count执行了');
  },[])
  // useEffect(()=>{
  //   console.log('ishot执行了');
  // },[ishot,count])







  return (
    <div>
      <h1>count的值是{count}</h1>
      <button onClick={() => { setSount(count + 1) }}>累加器</button>
      <hr />
      <h1>今天天气好{ishot?'热':'冷'}</h1>
      <button onClick={() => { setIshot(!ishot) }}>天气变化</button>
    </div>
  )
}



